
<template>
    <div style="height: 100%;">
      <el-menu  style="height: 100%;"
          router
          class="el-menu-vertical-demo">
  
          <template v-for="item in list" :key="item.path">
              <el-sub-menu v-if="item?.children?.length" :index="item.path">
                  <template #title>
                      <el-icon><component :is="item.meta.icon"/></el-icon>
                      <span>{{ item.meta.title }}</span>
                  </template>
                  <LymenuList :list="item.children"></LymenuList>
              </el-sub-menu>
              <el-menu-item v-else :index="item.path">
                  <el-icon><component :is="item.meta.icon"/></el-icon>
                  <span>{{ item.meta.title }}</span>
              </el-menu-item>
            </template>
    </el-menu>
  </div>
</template>

<script setup>
defineProps({
  list: {
    type: Array,
    required: true
  }
})

</script>
